import React from 'react';
import Spinner from 'react-native-loading-spinner-overlay';
import {StyleSheet} from 'react-native';

class Loading extends React.PureComponent {
  constructor(props) {
    super(props);
    this.state = {
      isShowLoading: false,
    };
  }

  show() {
    this.setState({
      isShowLoading: true,
    });
  }

  hide() {
    this.setState({
      isShowLoading: false,
    });
  }

  render() {
    const {isShowLoading} = this.state;
    if (!isShowLoading) {
      return null;
    }
    return (
      <Spinner
        visible={isShowLoading}
        size={'large'}
        color="#333"
        overlayColor="transparent"
        textContent={'加载中...'}
        textStyle={styles.spinnerTextStyle}
      />
    );
  }
}

const styles = StyleSheet.create({
  spinnerTextStyle: {
    color: '#333',
    fontSize: 14,
    top: 52,
  },
});
export default Loading;
